import { reactive, onMounted, defineComponent, toRefs, getCurrentInstance } from 'vue'
import movelogApi from '@/api/inwarehouse/movelog-api'
import warehouseApi from '@/api/inwarehouse/warehouse-api'
import ZlrtTable from '@/components/zlrt-table/table.vue'
import ZlrtSearch from '@/components/zlrt-search/search.vue'
import TableContext from '@/components/zlrt-table/table-context'

export default defineComponent({
  components: {
    ZlrtTable,
    ZlrtSearch
  },
  setup() {
    const statusOptions = [
      { value: '0', label: '新建' },
      { value: '99', label: '已完成' },
      // { value: '100', label: '已同步' }
    ]

    const ctx = reactive(new TableContext(getCurrentInstance(), {
      title: '调拨记录',
      api: movelogApi,
      columns: [
        { prop: 'destProjectName', label: '项目名称', valueType: 'input' },
        { prop: 'destAreaName', label: '调拨库区', width: 150 },
        { prop: 'destLocationName', label: '调拨库位', valueType: 'input', width: 200 },
        { prop: 'destLocationCode', label: '调拨库位编码', width: 120},
        { prop: 'status', label: '状态', valueType: 'select', options: statusOptions, slot: true, width: 100 },
        { prop: 'operation', label: '操作', slot: true, width: 150 }
      ],
      other: {
        getStatusName(val: string) {
          const obj = statusOptions.find(item => {
            return item.value === val
          })
          if(obj) {
            return obj['label']
          }
          return '-'
        }
      }
    }))

    const data = reactive({
      ctx,
      warehouseOptions: [],
    })

    const getWarehouseList = async() => {
      const params = { filter: { disabled: false } }
      const res = await warehouseApi.list(params)
      data.warehouseOptions = res.data.records
    }
    

    // init
    onMounted(() => {
      getWarehouseList()
      ctx.loadData()
    })

    return {
      ...toRefs(data)
    }
  }
})
